import createdName from '../../../utils/createdName'
import Icon from '../icon/index';
export default {
  name: createdName('Button'),
  props: {
    size: {
      type: String,
      default: 'default',
      options: ['medium', 'small', 'mini'],
      note: '尺寸'
    },
    type: {
      type: String,
      default: 'default',
      options: ['primary', 'success', 'warning', 'danger', 'info', 'text'],
      note: '按钮颜色类型'
    },
    plain: {
      type: Boolean,
      default: false,
      note: '是否朴素按钮'
    },
    round: {
      type: Boolean,
      default: false,
      note: '是否圆角按钮'
    },
    circle: {
      type: Boolean,
      default: false,
      note: '是否圆形按钮'
    },
    loading: {
      type: Boolean,
      default: false,
      note: '是否加载中状态'
    },
    disabled: {
      type: Boolean,
      default: false,
      note: '是否禁用状态'
    },
    icon: {
      type: String,
      default: '',
      note: '图标类名'
    },
    autofocus: {
      type: Boolean,
      default: false,
      note: '是否默认聚焦'
    }
  },
  render (h) {
    const _self = this;
    return h('button', {
      class: ['form-button', 'form-button--' + _self.type, _self.plain && 'is-plain', 'form-button--' + _self.size],
      on: {
        click () {
          _self.$emit('click')
        }
      }
    }, [
      _self.icon && h(Icon, {
        class: _self.icon
      }),
      h('span', [
        _self.$slots.default
      ])
    ])
  }
}